<template>
    <el-row class="user-info-form" type="flex" justify="center">
        <el-col>
            <el-form label-position="top" :model="editForm" :rules="editFormRules" ref="editForm" @submit.native.prevent>
                <input type="hidden"  v-model="editForm.id">
                <el-form-item label="选择查岗人员：" prop="dutyperson">
                  <el-select filterable v-model="checkedUsers" multiple>
                    <el-option
                      v-for="item in accountOptions"
                      :key="item.accountName"
                      :label="item.name"
                      :value="item.accountName">
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="选择应答时间（分钟）：" prop="time">
                  <el-slider 
                  v-model="editForm.time"
                  :max="5"
                  :min="1"
                  :marks="{
                    1: 1,
                    2: 2,
                    3: 3,
                    4:4,
                    5:5
                  }"
                  show-stops>
                  ></el-slider>
                </el-form-item>
                <el-form-item label-width="0" class="verifyidentity-button">
                    <el-button @click="closeDialog()" round>取消</el-button>
                    <el-button type="primary" @click="savePointType('editForm')" round>确定</el-button>
                </el-form-item>
            </el-form>
        </el-col>
    </el-row>
</template>

<script>
import util from '@/utils/util'
import { getUsers} from '@/api/api'
import { getDictByCode} from '@/api/dic'
import { getFbsTree} from '@/api/fbs'
import * as Dao from '@/api/inspect'

export default {
  name:'SuperviseForm',
  props: {
    editInfo: {
        type: Object,
        required: false
    },
    closeDialog: {
        type: Function,
        required: true
    },
  },
  data() {
    return {
        util:util,
        accountOptions:[],
        checkedUsers:[],
        editForm: {
            orgIds: this.$store.state.userinfo.isMuilUnitUser === 1 ? '' : this.$store.state.userinfo.org.id, // 业主单位
            time:1,
            dutyperson:''
        },
        editFormRules: {
            dutyperson: [
                { required: true, message: '选择查岗人员', trigger: 'blur' }
            ],
            time: [
                { required: true, message: '选择应答时', trigger: 'blur' },
            ],
        },
    }
  },
  created() {
      let infoObj = this.editInfo
      if(infoObj.id) {//编辑
         
      }
      this.getData()
  },
  methods: {
    getData() {
      let that = this
      //绑定用户下拉框
      getUsers({orgId:that.editForm.orgIds}).then((data)=>{
          this.accountOptions.push.apply(this.accountOptions,data.data);
      })
    },
    savePointType(formName) {
        // 阻止事件冒泡
        event.stopPropagation()
        let that = this
        that.$refs[formName].validate((valid) => {
            if (valid) {
                let parames = that.editForm
                parames.dutyUserAccounts = that.checkedUsers.join(",")
                Dao.addInspectRoute(parames).then(res => {
                  if( res.status === 200) {
                    that.$message({
                        message: '保存成功！',
                        type: 'success'
                    })
                  }else{
                    this.$message.error(res.info);
                  }
                  that.closeDialog(true)
                });
            } else {
                return false
            }
        });
    },
  }
}
</script>